<template>
  <m-modal
    v-model="visible"
    title="插件设置"
    class="v-matlab-setting"
    :width="528"
    :okLoading = "okLoading"
    @ok="handleSave"
    @cancel="handleCancel"
    
  >
    <div class="_content">
      <table border-collapse="collapse">
        <tr>
          <td class="_left-td">
            插件名称
          </td>
          <td>
            Matlab仿真软件
          </td>
        </tr>
        <tr>
          <td class="_left-td">
            安装路径
          </td>
          <td @click="handleChoosePath">
            {{matlabPath || '请选择'}}
          </td>
        </tr>
        <tr>
          <td class="_left-td">
            说明
          </td>
          <td>
            <div>1. 请先安装Matlab，获取方式<span class="g-operation">https:////ww2.mathworks.cn</span>,已安装软件用户可直接进入第2步。</div>
            <div>2. 安装完毕后，选择Matlab软件下bin文件夹所在位置。</div>
            <div>3. 点击“确定”，即可保存当前设置</div>
          </td>
        </tr>
      </table>
    </div>
  </m-modal>
</template>
<script>
import { Portal } from "src/components/common/Portal.vue";
import Modal from "src/components/common/CustomModal";
import { storage } from "src/util/common";
import { storeKey } from "@/constants/constants";
import LocalFile from "@/util/localFile/index";
const com = {
  name: "comp-matlab-setting",
  components: {
    "m-modal": Modal,
  },
  props: {},
  data() {
    const matlabPath = storage.get(storeKey.matlabPath);
    return {
      visible: false,
      oldMatlabPath: matlabPath,
      matlabPath,
      okLoading: false
    };
  },
  mounted() {
    this.visible = true;
  },
  methods: {
    handleOk(res) {
      this.visible = false;
      this.$emit("sure", res);
    },
    handleCancel(e) {
      this.visible = false;
      this.$emit("close", e);
    },
    handleChoosePath() {
      const newPath = LocalFile.showOpenDialog({
        properties: ["openDirectory"],
        buttonLabel: "确定",
      });
      if (newPath) {
        this.matlabPath = newPath;
      }
    },
    handleSave() {
      if (this.matlabPath !== this.oldMatlabPath) {
        storage.set(storeKey.matlabPath, this.matlabPath);
        this.okLoading = true;
        try {
          app.server.restart();
          setTimeout(async () => {
            const res = await app.server.test();
            console.log('app.server.test()', res);
            if (!res) {
              storage.set(storeKey.matlabPath, this.oldMatlabPath);
              app.$messageBox.error({ text: '更新matlab设置失败' });
            } else {
              this.handleOk();
            }
            this.okLoading = false;
          }, 10000);
        } catch (error) {
          this.okLoading = false;
        } 
      }
    },
  },
};

export default com;
export const matlabSetting = new Portal(com);
export const portal = matlabSetting;
</script>
<style lang="scss" scoped>
.v-matlab-setting {
  ._content {
    table {
      border-collapse: collapse;
    }
    td,th {
      border: 1px solid #E4E3E3;
      padding: 10px;
    }
    ._left-td {
        width: 100px;
    }
  }
}
</style>
